<style lang="less">
  @import "../../../styles/table-common.less";
</style>
<template>
  <div class="search">
    <!-- <div>服务企业信息管理</div> -->
    <Card>
      <Row class="operation">
        <Button @click="add" type="primary" icon="md-add">添加岗位培训内容</Button>
        <!-- <Button @click="delAll" icon="md-trash">批量删除</Button> -->
        <Button @click="getJobList" icon="md-refresh">刷新</Button>
      </Row>
      <Row v-show="openTip">
        <Alert show-icon>
          已选择
          <span class="select-count">{{selectCount}}</span> 项
          <a class="select-clear" @click="clearSelectAll">清空</a>
        </Alert>
      </Row>
      <Row>
        <Table
                :loading="loading"
                border
                :columns="columns"
                :data="data"
                sortable="custom"
                @on-sort-change="changeSort"
                @on-selection-change="showSelect"
                ref="table"
        ></Table>
      </Row>
      <Row type="flex" justify="end" class="page">
        <Page
                :current="searchForm.pageNumber"
                :total="total"
                :page-size="searchForm.pageSize"
                @on-change="changePage"
                @on-page-size-change="changePageSize"
                :page-size-opts="[10,20,50]"
                size="small"
                show-total
                show-elevator
                show-sizer
        ></Page>
      </Row>
    </Card>

    <!-- 全部事故案例 -->
    <Modal
            :title="modalTitle"
            v-model="train.isVisible"
            :mask-closable="false"
            :width="500"
            :styles="{top: '50px',width: '1000px'}"
            class="permModal"
    >
      <div style="position:relative">
        <Row style="margin-bottom: 20px;" @keydown.enter.native="handleSearch">
          <Form ref="trainSearchForm" :model="trainSearchForm" inline :label-width="70">
            <span>
              <Form-item label="岗位" prop="officeName">
                  <Select v-model="trainSearchForm.jobId" placeholder="请选择" clearable style="width: 200px">
                    <Option v-for="(item, i) in jobData" :key="i" :value="item.id">{{item.jobName}}</Option>
                  </Select>
              </Form-item>
            </span>
            <Form-item style="margin-left:-35px;" class="br">
              <Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button>
              <Button type="default" icon="md-trash" @click="delAll">批量删除</Button>
            </Form-item>
          </Form>
        </Row>
        <Table
                :loading="loading"
                border
                :columns="trainColumns"
                :data="trainData"
                sortable="custom"
                @on-sort-change="changeSort"
                @on-selection-change="showSelect"
                ref="table"
        ></Table>
      </div>
    </Modal>

    <accidentEdit :data="form" :type="showType" v-model="showUser" @on-submit="getAccidentCaseList" />

    <!-- 安全顾问案例和监管部门案例 -->
    <Modal
            :title="modalTitle"
            v-model="record.isVisible"
            :mask-closable="false"
            :width="500"
            :styles="{top: '50px',width: '1000px'}"
            class="permModal"
    >
      <div style="position:relative">
        <!-- <Row style="margin-bottom: 20px;">
          <Button type="primary" icon="md-add" @click="addRecord">{{record.title}}</Button>
          <Button type="default" icon="md-trash" @click="delAllRecord" style="margin-left: 20px;">批量删除</Button>
        </Row> -->
        <Table
                :loading="loading"
                border
                :columns="recordType === '1' ? breakColumns : dangerColumns"
                :data="recordType === '1' ? breakData : dangerData"
                sortable="custom"
                @on-sort-change="changeSort"
                @on-selection-change="showSelect"
                ref="table"
        ></Table>
      </div>
    </Modal>

    <safeEdit :data="breakForm" :type="breakType" v-model="showBreak" @on-submit="getJobAccidentCaseList" />
    
    <regulatoryEdit :data="dangerForm" :type="dangerType" v-model="showDanger" @on-submit="getDangerList" />
  </div>
</template>

<script>
  import {
    getServiceEnterpriseUser, 
    getJobAccidentByEnterpriseId,
    removeJobAccidentCase,
    getAccidentCaseList,
    removeAccidentCase,
    getJobVoListByEnterpriseId
  } from "@/api/index";
  import accidentEdit from './accidentEdit.vue'
  import safeEdit from './safeEdit.vue'
  import regulatoryEdit from './regulatoryEdit.vue'
  export default {
    name: "user-manage",
    components: {
      accidentEdit,
      safeEdit,
      regulatoryEdit
    },
    data() {
      return {
        jobData: [],
        height: 510,
        showUser: false,
        showType: "0",
        loading: true,
        openTip: true,
        selectCount: 0,
        selectList: [],
        searchKey: "",
        searchForm: {
          pageNumber: 1,
          pageSize: 10,
          sort: "createTime",
          order: "desc"
        },
        form: {},
        columns: [
          {
            type: "selection",
            width: 60,
            align: "center",
            fixed: "left"
          },
          {
            type: "index",
            width: 60,
            align: "center",
            fixed: "left"
          },
          {
            title: "公司logo",
            key: "avatar",
            minWidth: 125,
            render: (h, params) => {
              return h('avatar', params.row.avatar)
            }
          },
          {
            title: "公司名称",
            key: "companyName",
            minWidth: 125
          },
          {
            title: "公司类型",
            key: "companyType",
            minWidth: 125
          },
          {
            title: "公司规模",
            key: "headcount",
            minWidth: 125
          },
          {
            title: "公司地址",
            key: "companyAddress",
            minWidth: 200
          },
          {
            title: "状态",
            key: "managementForms",
            minWidth: 125
          },
          {
            title: "操作",
            key: "action",
            width: 400,
            align: "center",
            fixed: "right",
            render: (h, params) => {
              let enableOrDisable = "";
              return h("div", [
                h(
                        "Button",
                        {
                          props: {
                            type: "primary",
                            size: "small"
                          },
                          style: {
                            marginRight: "5px"
                          },
                          on: {
                            click: () => {
                              this.view(params.row);
                            }
                          }
                        },
                        "案例列表"
                ),
                h(
                        "Button",
                        {
                          props: {
                            type: "default",
                            size: "small"
                          },
                          style: {
                            marginRight: "5px"
                          },
                          on: {
                            click: () => {
                              this.viewBreak(params.row);
                            }
                          }
                        },
                        "添加安全顾问案例"
                ),
                h(
                        "Button",
                        {
                          props: {
                            type: "primary",
                            size: "small"
                          },
                          style: {
                            marginRight: "5px"
                          },
                          on: {
                            click: () => {
                              this.viewDanger(params.row);
                            }
                          }
                        },
                        "添加监管部门案例"
                )
              ]);
            }
          }
        ],
        data: [],
        total: 0,
        trainSearchForm: {
          pageNumber: 1,
          pageSize: 10,
          sort: 'createTime',
          order: 'desc',
          enterpriseId: '',
          jobId: ''
        },
        trainColumns: [
          {
            type: "selection",
            width: 60,
            align: "center",
            fixed: "left"
          },
          {
            type: "index",
            width: 60,
            align: "center",
            fixed: "left"
          },
          {
            title: "企业名称",
            key: "enterpriseName",
            minWidth: 125
          },
          {
            title: "事故概况",
            key: "generalSituation",
            minWidth: 125
          },
          {
            title: "岗位名称",
            key: "jobName",
            minWidth: 125
          },
          {
            title: "事故类型",
            key: "accidentCaseType",
            minWidth: 125
          },
          {
            title: "事故图片",
            key: "accidentCasePicLimitOne",
            width: 100,
            align: "center",
            render: (h, params) => {
              return h("accidentCasePicLimitOne", {
                props: {
                  src: params.row.accidentCasePicLimitOne
                }
              });
            }
          },
          {
            title: "操作",
            key: "action",
            width: 250,
            align: "center",
            fixed: "right",
            render: (h, params) => {
              let enableOrDisable = "";
              return h("div", [
                // h(
                //         "Button",
                //         {
                //           props: {
                //             type: "primary",
                //             size: "small"
                //           },
                //           style: {
                //             marginRight: "5px"
                //           },
                //           on: {
                //             click: () => {
                //               this.edit(params.row);
                //             }
                //           }
                //         },
                //         "编辑"
                // ),
                h(
                        "Button",
                        {
                          props: {
                            type: "error",
                            size: "small"
                          },
                          style: {
                            marginRight: "5px"
                          },
                          on: {
                            click: () => {
                              this.remove(params.row);
                            }
                          }
                        },
                        "删除"
                )
              ]);
            }
          }
        ],
        modalTitle: '',
        train: {
          enterpriseUserId: '',
          title: '',
          isVisible: false
        },
        trainData: [],
        record: {
          title: '',
          isVisible: false,
          enterpriseUserId: '',
        },
        recordType: 0,
        breakData: [],
        breakColumns: [
          {
            type: "selection",
            width: 60,
            align: "center",
            fixed: "left"
          },
          {
            type: "index",
            width: 60,
            align: "center",
            fixed: "left"
          },
          {
            title: "企业名称",
            key: "enterpriseName",
            minWidth: 150
          },
          {
            title: "企业类型",
            key: "enterpriseType",
            minWidth: 125
          },
          {
            title: "事故发生地",
            key: "site",
            minWidth: 125
          },
          {
            title: "事故发生时间",
            key: "time",
            minWidth: 175
          },
          {
            title: "事故概况",
            key: "generalSituation",
            minWidth: 125
          },
          {
            title: "事故类型",
            key: "accidentCaseType",
            minWidth: 125
          },
          {
            title: "受伤人数",
            key: "injuryNum",
            minWidth: 125,
            render: (h, params) => {
              let str = params.row.injuryNum + ' 人'
              return h('span', str)
            }
          },
          {
            title: "死亡人数",
            key: "deathToll",
            minWidth: 125,
            render: (h, params) => {
              let str = params.row.deathToll + ' 人'
              return h('span', str)
            }
          },
          {
            title: "操作",
            key: "action",
            width: 220,
            align: "center",
            fixed: "right",
            render: (h, params) => {
              let enableOrDisable = "";
              return h("div", [
                h(
                        "Button",
                        {
                          props: {
                            type: "primary",
                            size: "small"
                          },
                          style: {
                            marginRight: "5px"
                          },
                          on: {
                            click: () => {
                              this.addJobTrain(params.row, 1);
                            }
                          }
                        },
                        "添加岗位"
                ),
                // h(
                //         "Button",
                //         {
                //           props: {
                //             type: "error",
                //             size: "small"
                //           },
                //           style: {
                //             marginRight: "5px"
                //           },
                //           on: {
                //             click: () => {
                //               this.removeRecord(params.row);
                //             }
                //           }
                //         },
                //         "删除"
                // )
              ]);
            }
          }
        ],
        showBreak: false,
        breakType: "0",
        breakForm: {},
        dangerData: [],
        dangerColumns: [
          {
            type: "selection",
            width: 60,
            align: "center",
            fixed: "left"
          },
          {
            type: "index",
            width: 60,
            align: "center",
            fixed: "left"
          },
          {
            title: "企业名称",
            key: "enterpriseName",
            minWidth: 125
          },
          {
            title: "企业类型",
            key: "enterpriseType",
            minWidth: 125
          },
          {
            title: "事故发生地",
            key: "site",
            minWidth: 125
          },
          {
            title: "事故发生时间",
            key: "time",
            minWidth: 125
          },
          {
            title: "事故概况",
            key: "generalSituation",
            minWidth: 125
          },
          {
            title: "岗位名称",
            key: "jobName",
            minWidth: 125
          },
          {
            title: "事故类型",
            key: "accidentCaseType",
            minWidth: 125
          },
          {
            title: "受伤人数",
            key: "injuryNum",
            minWidth: 125,
            render: (h, params) => {
              let str = params.row.injuryNum + ' 人'
              return h('span', str)
            }
          },
          {
            title: "死亡人数",
            key: "deathToll",
            minWidth: 125,
            render: (h, params) => {
              let str = params.row.deathToll + ' 人'
              return h('span', str)
            }
          },
          {
            title: "操作",
            key: "action",
            width: 220,
            align: "center",
            fixed: "right",
            render: (h, params) => {
              let enableOrDisable = "";
              return h("div", [
                h(
                        "Button",
                        {
                          props: {
                            type: "primary",
                            size: "small"
                          },
                          style: {
                            marginRight: "5px"
                          },
                          on: {
                            click: () => {
                              this.addJobTrain(params.row, 2);
                            }
                          }
                        },
                        "添加岗位"
                ),
                // h(
                //         "Button",
                //         {
                //           props: {
                //             type: "error",
                //             size: "small"
                //           },
                //           style: {
                //             marginRight: "5px"
                //           },
                //           on: {
                //             click: () => {
                //               this.removeRecord(params.row);
                //             }
                //           }
                //         },
                //         "删除"
                // )
              ]);
            }
          }
        ],
        dangerForm: {},
        dangerType: "0",
        showDanger: false,
      };
    },
    methods: {
      init() {
        this.getJobList();
        this.getTrainList();
      },
      changePage(v) {
        this.searchForm.pageNumber = v;
        this.getJobList();
        this.clearSelectAll();
      },
      changePageSize(v) {
        this.searchForm.pageSize = v;
        this.getJobList();
      },
      getJobList() {
        // 多条件搜索用户列表
        this.loading = true;
        getServiceEnterpriseUser(this.searchForm).then(res => {
          this.loading = false;
          if (res.code === 200) {
            this.data = res.result.content;
            this.total = res.result.size;
          }else {
            this.data = [];
            this.total = 0;
          }
        });
      },
      getTrainList(id) {
        getJobVoListByEnterpriseId({ enterpriseId: id }).then(res => {
          if (res.code === 200) {
            this.jobData = res.result;
          } else {
            this.jobData = []
          }
        })
      },
      handleSearch() {
        this.trainSearchForm.pageNumber = 1;
        this.trainSearchForm.pageSize = 10;
        if (this.trainSearchForm.jobId == undefined) {
          this.trainSearchForm.jobId = ''
        }
        this.getJobAccidentByEnterpriseId();
      },
      changeSort(e) {
        this.searchForm.sort = e.key;
        this.searchForm.order = e.order;
        if (e.order === "normal") {
          this.searchForm.order = "";
        }
        this.getJobList();
      },
      showDetail(v) {
        // 转换null为""
        for (let attr in v) {
          if (v[attr] == null) {
            v[attr] = "";
          }
        }
        let str = JSON.stringify(v);
        let data = JSON.parse(str);
        this.form = data;
        this.showType = "0";
        this.showUser = true;
      },
      add() {
        this.showType = "2";
        this.showUser = true;
      },
      edit(v) {
        // 转换null为""
        for (let attr in v) {
          if (v[attr] == null) {
            v[attr] = "";
          }
        }
        let str = JSON.stringify(v);
        let data = JSON.parse(str);
        this.train.isVisible = false;
        
        if (this.type === "1") {
          this.form = data;
          this.form.enterpriseId = this.train.enterpriseId;
          this.showType = "1";
          this.showUser = true;
        } else {
          this.partForm = data;
          this.partForm.jobTrainId = this.train.jobTrainId;
          this.partType = "1";
          this.showPart = true;
        }
      },
      view(v) {
        this.trainSearchForm.enterpriseId = v.id;
        this.form.enterpriseId = v.id;
        this.modalTitle = "查看 " + v.companyName + " 的事故案例列表"
        this.getTrainList(v.id)
        this.getJobAccidentByEnterpriseId()
      },
      getJobAccidentByEnterpriseId() {
        this.type = "1";
        if (this.trainSearchForm.jobId == undefined) {
          this.trainSearchForm.jobId = ''
        }
        getJobAccidentByEnterpriseId(this.trainSearchForm).then(res => {
          if (res.code === 200) {
            console.log(this.type)
            this.trainData = res.result.content;
          } else if (res.code === 201) {
            this.trainData = []
          }
        })
        this.train.title = "添加岗位事故案例"
        this.train.isVisible = true;
      },
      addJobTrain(v, k) {
        this.record.isVisible = false;
        // if (this.type === "1") {
        //   this.showType = "2";
        //   this.showUser = true;
        // } else if (this.type === "2") {
        //   this.partType = "2";
        //   this.showPart = true;
        // }
        this.form.enterpriseUserId = this.record.enterpriseUserId;
        this.form.accidentCaseId = v.id;
        if (k === 1) { // 安全顾问
          this.showType = "2";
          this.showUser = true;
        } else { // 事故案例

        }
      }, 
      remove(v) {
        this.$Modal.confirm({
          title: "确认删除",
          content: "您确认要删除该条事故案例吗?",
          loading: true,
          onOk: () => {
            removeJobAccidentCase({ ids: v.id }).then(res => {
              this.$Modal.remove();
              if (res.success) {
                this.$Message.success("删除成功");
                this.getJobAccidentByEnterpriseId();
              }
            });
          }
        });
      },
      showSelect(e) {
        // this.exportData = e;
        this.selectList = e;
        this.selectCount = e.length;
      },
      clearSelectAll() {
        this.$refs.table.selectAll(false);
      },
      delAll() {
        if (this.selectCount <= 0) {
          this.$Message.warning("您还未选择要删除的数据");
          return;
        }
        this.$Modal.confirm({
          title: "确认删除",
          content: "您确认要删除所选的 " + this.selectCount + " 条数据?",
          loading: true,
          onOk: () => {
            let ids = "";
            this.selectList.forEach(function(e) {
              ids += e.id + ",";
            });
            ids = ids.substring(0, ids.length - 1);
            removeJobAccidentCase({ ids: ids }).then(res => {
              this.$Modal.remove();
              if (res.success) {
                this.$Message.success("删除成功");
                this.clearSelectAll();
                this.getJobAccidentByEnterpriseId();
              }
            });
          }
        });
      },
      viewBreak(v) {
        this.recordType = "1";
        this.modalTitle = "查看 " + v.companyName + " 的安全顾问案例列表";
        this.record.enterpriseUserId = v.id;
        this.getAccidentCaseList()
      },
      getAccidentCaseList() {
        let params = {
          pageNumber: 1,
          pageSize: 100,
          sort: 'createTime',
          order: 'desc',
          enterpriseUserId: this.record.enterpriseUserId,
          type: 1
        }
        getAccidentCaseList(params).then(res => {
          if (res.code === 200) {
            this.breakData = res.result.content;
          } else if (res.code === 201) {
            this.breakData = []
          }
        })
        this.record.title = "添加安全顾问事故案例";
        this.record.isVisible = true;
      },
      addRecord() {
        this.record.isVisible = false;
        if (this.recordType === "1") {
          this.breakForm.enterpriseUserId = this.record.enterpriseUserId;
          this.breakType = "2";
          this.showBreak = true;
        } else if (this.recordType === "2") {
          this.dangerForm.enterpriseUserId = this.record.enterpriseUserId;
          this.dangerType = "2";
          this.showDanger = true;
        }
      },
      editRecord(v) {
        // 转换null为""
        for (let attr in v) {
          if (v[attr] == null) {
            v[attr] = "";
          }
        }
        let str = JSON.stringify(v);
        let data = JSON.parse(str);
        this.record.isVisible = false;
        
        if (this.recordType === "1") {
          this.breakForm = data;
          this.breakForm.enterpriseUserId = this.record.enterpriseUserId;
          this.breakType = "1";
          this.showBreak = true;
        } else {
          this.dangerForm = data;
          this.dangerForm.enterpriseId = this.record.enterpriseId;
          this.dangerType = "1";
          this.showDanger = true;
        }
      },
      delAllRecord() {
        if (this.selectCount <= 0) {
          this.$Message.warning("您还未选择要删除的数据");
          return;
        }
        this.$Modal.confirm({
          title: "确认删除",
          content: "您确认要删除所选的 " + this.selectCount + " 条数据?",
          loading: true,
          onOk: () => {
            let ids = "";
            this.selectList.forEach(function(e) {
              ids += e.id + ",";
            });
            ids = ids.substring(0, ids.length - 1);
            if (this.recordType === "1") {
              removeAccidentCase({ ids: ids }).then(res => {
                this.$Modal.remove();
                if (res.success) {
                  this.$Message.success("删除成功");
                  this.clearSelectAll();
                  this.getAccidentCaseList();
                }
              });
            } else {
              removeAccidentCase({ ids: ids }).then(res => {
                this.$Modal.remove();
                if (res.success) {
                  this.$Message.success("删除成功");
                  this.clearSelectAll();
                  this.getDangerList();
                }
              });
            }
          }
        });
      },
      removeRecord(v) {
        this.$Modal.confirm({
          title: "确认删除",
          content: "您确认要删除"+ (this.recordType === '1' ? "违章记录" : "隐患记录")+"吗?",
          loading: true,
          onOk: () => {
            if (this.recordType === "1") {
              removeAccidentCase({ ids: v.id }).then(res => {
                this.$Modal.remove();
                if (res.success) {
                  this.$Message.success("删除成功");
                  this.getAccidentCaseList();
                }
              });
            } else {
              removeAccidentCase({ ids: v.id }).then(res => {
                this.$Modal.remove();
                if (res.success) {
                  this.$Message.success("删除成功");
                  this.getDangerList();
                }
              });
            }
          }
        });
      },
      viewDanger(v) {
        this.recordType = "2";
        this.modalTitle = "查看 " + v.companyName + " 的监管部门案例";
        this.record.enterpriseUserId = v.id;
        this.getDangerList()
      },
      getDangerList() {
        let params = {
          pageNumber: 1,
          pageSize: 10,
          sort: 'createTime',
          order: 'desc',
          // enterpriseUserId: this.record.enterpriseUserId,
          type: 2,
        }
        getAccidentCaseList(params).then(res => {
          if (res.code === 200) {
            this.dangerData = res.result.content;
          } else if (res.code === 201) {
            this.dangerData = []
          }
        })
        this.record.title = "添加监管部门案例";
        this.record.isVisible = true;
      },
    },
    mounted() {
      // 计算高度
      this.height = Number(document.documentElement.clientHeight - 230);
      this.init();
    }
  };
</script>